<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
    <h:head>
        <meta charset="utf-8"/>
        <title>
            <ui:insert name="title"/>
            BooXtore.com
        </title>
        <link rel="icon" href="#{resource['favicon.ico']}" />
        <link href="http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,300,700" rel="stylesheet" type="text/css"/>
        <h:outputStylesheet name="base.css" library="css" />
        <ui:insert name="css"></ui:insert>
    </h:head>
    <h:body>
        <div id="container">
            <header>
                <div id="title">
                    <span id="title-bold">Booxtore</span>.com
                </div>
                <div id="panel">
                    <h:link id="shopping" outcome="/shopping/index">
                        <h:outputText value="#{shoppingCart.itemsNumber}"/>
                    </h:link>
                </div>
            </header>
            <nav>
                <ul>
                    <li>
                        <h:link outcome="/index" value="#{lang._layout_home}"/>
                    </li>
                    <li>
                        <h:link outcome="/account/index" value="#{lang._layout_account}"/>
                    </li>
                    <li>
                        <h:link outcome="/library/index" value="#{lang._layout_library}"/>
                    </li>
                    <li>
                        <h:link outcome="/about" value="#{lang._layout_about}"/>
                    </li>
                </ul>
            </nav>
            
            <ui:insert name="content"></ui:insert>
            <footer>
                <p>
                    Copyright © 2013 BooXtore.com
                </p>
            </footer>
        </div>
    </h:body>
</html>

